import React from "react";
import { Router, Route, IndexRoute } from "react-router";
import { connect } from "react-redux";

import Main from "../component/Main.jsx";
import Index from "../component/home/index.jsx";
import Dashboard from "../component/home/Dashboard.jsx"

import homeRouter from "./home.jsx";
import externalRouter from "./external.jsx";
import errorRouter from "./error.jsx";

import vehicleRouter from "./vehicle.jsx";
import modelRouter from "./model.jsx";
import messageRouter from "./message.jsx";

const routers = [homeRouter, vehicleRouter, modelRouter, messageRouter, ...externalRouter, ...errorRouter];

class RootRoute extends React.Component {
    constructor(props) {
        super(props);

        this.onRouteEnter = this.onRouteEnter.bind(this);
        this.onRouteChange = this.onRouteChange.bind(this);
    }

    componentDidMount() {
        // console.log("componentDidMount", this.context.router);
    }

    onRouteEnter(nextState, replace, next) {
        // console.log("onRouteEnter", nextState.location.pathname);
        next();
    }

    onRouteChange(prevState, nextState, replace, next) {
        // console.log("onRouteChange", nextState.location.pathname);
        next();
    }

    render() {
        const history = this.props.history;
        const allRoutes = <Route path="/" component={ Main } onEnter={ this.onRouteEnter } onChange={ this.onRouteChange }>
                              <IndexRoute component={ Index } />
                              { routers }
                          </Route>;
        return <Router history={ history } routes={ allRoutes } />;
    }
}

export default connect((state) => ({}), (dispatch) => ({}))(RootRoute);